<!DOCTYPE html>
<html lang="zh-cmn-Hans">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
    <link rel="stylesheet" href="../../static/assets/css/zpui.css" />
    <link rel="stylesheet" href="../../static/assets/css/all.css" />
    <script src="../../static/assets/js/page.js"></script>
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>

    <title> 经销商管理 </title>
    <style>
        .affirm {
            width: 40px;
            height: 30px;
            float: right;
            position: relative;
            margin-top: -30px;
        }

        table{border-collapse:collapse;border-spacing:0;border-left:1px solid #888;border-top:1px solid #888;background:white;}
        th,td{border-right:1px solid #888;border-bottom:1px solid #888;padding:5px 15px;}
        th{font-weight:bold;background:white;}
    </style>
</head>

<body>
    <div class="page">
        <div class="page-hd">
            <div class="header bor-1px-b">
                <div class="header-left">
                    <a href="javascript:history.go(-1)" class="left-arrow"></a>
                </div>
                <div class="header-title">经销商管理</div>
                <div class="header-right">
                    <a href="#"></a>
                </div>
            </div>
        </div>

        <div class="page-bd">
            <!-- 页面内容-->
            <div class="member_top">
                <div class="search-bar">
                    <form action="#">
                        <input type="text" id="key" style="box-sizing: border-box;padding-right: 0.6rem;" placeholder="请输入用户ID或者手机号">
                    </form>
                    <div class="affirm"></div>
                </div>
                <div class="card-flex text-white" style="background: transparent;margin: 0;padding: 0;">
                    <div class="flex_item">
                        <div class="fs48 fw600" id='alluser'>0</div>
                        <div class="fs24">累计经销商人数</div>
                    </div>
                </div>
                <div class="card-flex text-white mt0" style="background: transparent;padding-bottom: 0.3rem">
                    <div class="flex_item">
                        <div class="fs36 fw600" id='w_count'>0</div>
                        <div class="fs24">本周新增人数</div>
                    </div>
                    <div class="flex_item">
                        <div class="fs36 fw600" id="m_count">0</div>
                        <div class="fs24">本月新增人数</div>
                    </div>
                </div>
            </div>
            <div class="weui-cells mt0 border-none" style="background: transparent;">
                <div class="weui-cell border-none pb0">
                    <!--<div class="weui-cell__bd">-->
                    <!--    <div class="selectinput">-->
                    <!--        <input type="text" id='picker' class="weui-input" value="全部" />-->
                    <!--    </div>-->
                    <!--</div>-->
                    <!--<div class="weui-cell__fd" style="text-align: right;">-->
                    <!--    <div class="selectinput" style="width: 2rem">-->
                    <!--        <input type="text" id='datetime-picker' class="weui-input" value="2021年 01月" />-->
                    <!--    </div>-->
                    <!--</div>-->
                </div>
            </div>
            <div class="weui-cells card-box shop-list">
               
            </div>
 <script type="text/html" id="orderTpl">
                    {{each data as item index}}
                    <div style="display: flex; flex-direction: column;">
                        <div class="weui-cell">
                            <div class="weui-cell__hd mr10">
                                <img src="{{item.avatar}}" class="tximg">
                            </div>
                            <div class="weui-cell__bd">
                                <div class="weui-flex " style="justify-content: space-between">
                                    <div class="fs26 fw600">{{item.nickname}}


                                    </div>
                                    <div class="fs26 ">ID：5000{{item.userId}}</div>
                                </div>
                                <div class=" fs26  mt10" style="justify-content: space-between">
                                    <div>手机：{{item.mobile}}</div>
                                    {{if item.user_level_id == 1}}
                                    <div>等级：游客</div>
                                    {{/if}}
                                    {{if item.user_level_id == 2}}
                                    <div>等级：VIP</div>
                                    {{/if}}
                                    {{if item.user_level_id == 3}}
                                    <div>等级：合伙人</div>
                                    {{/if}}
                                    {{if item.user_level_id == 4}}
                                    <div>等级：大区合伙人</div>
                                    {{/if}}
                                    {{if item.user_level_id == 5}}
                                    <div>等级：联合创始人</div>
                                    {{/if}}
                                    {{if item.user_level_id == 6}}
                                    <div>等级：战略合作商</div>
                                    {{/if}}
                                    {{if item.user_level_id == 7}}
                                    <div>等级：总公司</div>
                                    {{/if}}
                                    <div>注册时间：{{item.register_time}}</div>

                                    <!--                                <div>A类累计出货数：{{item.allnum}}</div>-->
                                    <!--                                <div>A类月出货数：{{item.monthnum}}</div>-->
                                    <!--                                <div>B类累计出货数：{{item.allnum2}}</div>-->
                                    <!--                                <div>B类月出货数：{{item.monthnum2}}</div>-->
                                </div>
                            </div>
                        </div>

                        <table>
                            <tr>
                                <th>名称</th>
                                <th>累计出货</th>
                                <th>月出货</th>
                            </tr>
                            {{if item.sonGoodsList != ''}} {{each item.sonGoodsList as myItem index}}
                            <tr>
                                <td>{{myItem.goodsName}}</td>
                                <td>{{myItem.allNum}}</td>
                                <td>{{myItem.monthNum}}</td>
                            </tr>
                            {{/each}} {{else}}
                            <tr>
                                <td colspan="3">暂无出货记录</td>
                            </tr>
                            {{/if}}

                        </table>
                        <br>
                        <hr>
                    </div>
                    {{/each}}
                </script>

        </div>
        <input type="hidden" value="[{&quot;role_id&quot;:0,&quot;role_name&quot;:&quot;\u5168\u90e8&quot;},{&quot;role_id&quot;:4,&quot;role_name&quot;:&quot;\u95e8\u5e97&quot;},{&quot;role_id&quot;:5,&quot;role_name&quot;:&quot;\u603b\u4ee3&quot;},{&quot;role_id&quot;:6,&quot;role_name&quot;:&quot;C\u7ea7\u533a\u57df&quot;}]" id="rolelist">
    </div>

    <script src="../../static/assets/js/lib/jquery-2.1.4.js"></script>
    <script src="../../static/assets/js/jquery-weui.min.js"></script>
    <script src="../../static/js/jquery/jquery.cookie.js"></script>
    <script src="../../static/assets/js/lib/fastclick.js"></script>
    <script src="../../static/tpl/js/art-template.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <script src="../../static/mobile/default/js/page.js"></script>
    <script>
        $(function() {
            FastClick.attach(document.body);
        });
    </script>
    <script>
        var date = new Date();
     $('#datetime-picker').val(date.getFullYear()+"年 0"+(date.getMonth()+1)+"月")
        var time = date.getFullYear()+"年 0"+(date.getMonth()+1)+"月";
        var role_id = 0;
        var nowPage = [],
            getAgain = [],
            isLoadend = [];
        var _type = "shop-list";
        var key = '';
        
              share()
     function  share(){
    /***用户点击分享到微信圈后加载接口接口*******/
        var url=window.location.href;
        console.log("url:"+url);
            $.ajax({
		    url: "/api/mp/wxconfig",
		    type: "post",
		    data:{shareUrl:url},
		    headers:{ token: $.cookie('code')},
		    dataType: "json",
		    success: function(data){
		         configData = {
                    debug : false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                    appId: data.data.appid, // 必填，公众号的唯一标识
                    timestamp: data.data.timestamp, // 必填，生成签名的时间戳
                    nonceStr: data.data.nonceStr, // 必填，生成签名的随机串
                    signature: data.data.signature,// 必填，签名，见附录1
                    jsApiList : ['hideOptionMenu']
                    // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
               };
               
               //step2:注入配置信息
               wx.config(configData);
               //step3:通过ready接口处理成功验证
               wx.ready(function () {
                   // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
//                 alert("执行ready方法");
//                 wx.checkJsApi({
//                      jsApiList: ['chooseImage'] // 需要检测的JS接口列表，所有JS接口列表见附录2,
//                      success: function(res) {
//                      // 以键值对的形式返回，可用的api值true，不可用为false
//                      // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
//                      }
//                 });
                   //接口1:获取网络类型
                    wx.getNetworkType({
                        success: function (res) {
                          oldNet = res.networkType; // 返回网络类型2g，3g，4g，wifi
//                        alert("网络类型"+ oldNet);
                        }
                     });
                   //禁用右上角菜单按钮
                   wx.hideOptionMenu();
		    })
		    },
		    error: function() {
// 			    _alert('ajax request failed!!!!');
			    return;
		    } 
        })

	    
	    
	    }
        $(function() {
            
            //搜索
            $('.affirm').click(function() {
                key = $('#key').val();
                isLoadend[_type] = false;
                getAgain[_type] = false;
                nowPage[_type] = 1;
                get = false;
                $('.' + _type + '').html('');
                getList('',true);
            })

            var rolelist = $('#rolelist').val();
            rolelist = JSON.parse(rolelist);
            var role = [];
            var role_val = [];
            for (let index = 0; index < rolelist.length; index++) {
                role.push(rolelist[index]['role_name']);
                role_val[rolelist[index]['role_name']] = rolelist[index]['role_id'];
            }
            $("#picker").picker({
                title: "请选择",
                cols: [{
                    textAlign: 'center',
                    values: role
                }],
                onClose: function() {
                    role_id = role_val[$("#picker").val()];
                    isLoadend[_type] = false;
                    getAgain[_type] = false;
                    nowPage[_type] = 1;
                    get = false;
                    $('.' + _type + '').html('');
                    getList();
                }
            });
            var y = []; //年
            var m = []; //月
            var str_y = 2018; //选择时间从2018开始
            var end_y = "2021";
            for (let index = str_y; index < Number(end_y) + 1; index++) {
                y.push(index + '年');
            }
            for (let index = 1; index < 13; index++) {
                if (index < 10) index = '0' + index;
                m.push(index + '月');
            }
            $("#datetime-picker").picker({
                title: "请选择时间",
                cols: [{
                    textAlign: 'center',
                    values: y
                        //如果你希望显示文案和实际值不同，可以在这里加一个displayValues: [.....]
                }, {
                    textAlign: 'center',
                    values: m
                }, ],
                onClose: function() {
                    time = $("#datetime-picker").val();
                    isLoadend[_type] = false;
                    getAgain[_type] = false;
                    nowPage[_type] = 1;
                    get = false;
                    $('.' + _type + '').html('');
                    getList();
                }
            });

            var get = false;
            // 当用户滚动到页面底部的时候加载更多内容。
            $('.page-bd').infinite(100);
            $('.page-bd').infinite().on("infinite", function() {
                if (get) return;
                getList();
            })

            //请求列表数据
            getList()

            function getList(isagain,bool) {
                page = nowPage[_type];
                if (typeof(page) == 'undefined') page = 1;
                if (isLoadend[_type] == true) return false;
                if (isagain == true) {
                    if (getAgain[_type] == false) return false;
                    getAgain[_type] = false;
                } else {
                    $('.' + _type + '').append('<div id="jz" style="margin-bottom:20px;" class="fs24 text-muted mt30 tc">内容加载中~</div>');
                }
                var reg = new RegExp("[年月 ]","g")
                // var  timePicker = time.replace(reg, "") 
                var data = ''
                isLoadend[_type] = true;
                if(bool){
                    data = {
                        // 'tmonth': timePicker,
                        'userNameOrMobile':key,
                        'size':10,
                        'page':1
                    }
                }else{
                     data = {
                        // 'tmonth': timePicker,
                        'size':10,
                        'page':page
                    }
                }
                $.ajax({
                    url: '/api/mp/getSonUser', // 跳转到 action
                    data: data,
                    type: 'get',
                    headers:{'token': $.cookie('code')},
                            dataType: 'json',
                    success: function(res) {
                        isLoadend[_type] = false;
                        if (res.errno != 0) {
                            $.alert(res.errmsg);
                            getAgain[_type] = true;
                            $('.' + _type + '').find('#jz').html('加载失败，点击重新加载.');
                            return false;
                        }

                        $('#m_count').text(res.data.addUserMonth);
                        $('#w_count').text(res.data.addUserWeek);
                         $('#alluser').text(res.data.allUser);
                       
                        $('#jz').remove();
                        get = false;
                        if (res.data.sonUserList.data.length > 0) {
                            $('.' + _type + '').append(template('orderTpl', res.data.sonUserList));
                            
                        } else {
                            $('.' + _type + '').html('<div class="empeyOrder" style="width: 100%;text-align: center;">\
                                <img style = "width: 100%;" src = "/static/mobile/default/images/emptyData.png" alt = "">\
                                <span class="fs24 text-muted tc mt30">暂无记录</span>\
                            </div>');
                            get = true;
                        }

                        if (res.data.sonUserList.totalPages == page) {
                            $('.' + _type + '').append('<div id="jz" style="margin-bottom:20px;" class="fs24 text-muted mt30 tc">---我也有底线的---</div>');
                            isLoadend[_type] = true;
                            get = true;
                        }else{
                             nowPage[_type] = page + 1;
                        }
                    },
                    error: function() {
                        isLoadend[_type] = false;
                        getAgain[_type] = true;
                        $('.' + _type + '').find('#jz').html('加载失败，点击重新加载.');
                    }
                });
            }
        })
    </script>
</body>

</html>